<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>首页</title>
		<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link href="../css/swiper.min.css" rel="stylesheet"/>
		<link href="../css/commons.css" rel="stylesheet"/>
		<link href="../css/index.css?r=4" rel="stylesheet" />

		<style>
			.swiper-container {
				width: 100%;
				height: 198px;
			}
			.swiper-container2,
			.swiper-container2 .swiper-wrapper{
				background: #fff;
			}
			.swiper-container4 {
				width: 100%;
				height: auto;
				position: relative;
			}
			.swiper-container4 img{
				width:100%;
				height:auto;
			}
			.swiper-slide {
				text-align: center;
				font-size: 18px;
				background: #fff;
				display: -webkit-box;
				display: -ms-flexbox;
				display: -webkit-flex;
				display: flex;
				-webkit-box-pack: center;
				-ms-flex-pack: center;
				-webkit-justify-content: center;
				justify-content: center;
				-webkit-box-align: center;
				-ms-flex-align: center;
				-webkit-align-items: center;
				align-items: center;
			}
			.active{
				background: rgba(255,255,255,.63);
			}
			#index{
				color: #06c1ae;
			}
			#me,#nearby,#shop{
				color: #666;
			}
			.guide{
				position: absolute;
				bottom: 50px;
				left: 0;
				z-index: 99;
				width: 100%;
				height: 42px;
				background: rgba(0, 0, 0,.8);
				color: rgb(255, 255, 255);
			}
			.guide #close{
				width: 17px;
				height: 17px;
				float: left;
				margin-top: 13px;
				margin-left: 9px;
				margin-right: 14px;
			}
			.guide #logo{
				width: 34px;
				height: 34px;
				margin-top: 4px;
				float: left;
			}
			.guide #client{
				line-height: 42px;
				font-size: 14px;
				margin-left: 8px;
			}
			.guide #download {
				float: right;
				border: 1px solid #49c9bc;
				height: 27px;
				line-height: 24px;
				border-radius: 4px;
				margin-right: 8px;
				margin-top: 8px;
				font-size: 13px;
				padding: 0 6px;
				color: #49c9bc;
			}
			.rotate{
				-webkit-animation: anim .6s infinite alternate;
				-ms-animation: anim .6s infinite alternate;
				animation: anim .6s infinite alternate;
			}
			@-webkit-keyframes anim {
				from { -webkit-transform: rotateY(180deg); }
				to { -webkit-transform: rotateY(360deg); }
			}
			@-ms-keyframes anim {
				from { -ms-transform: rotateY(180deg); }
				to { -ms-transform: rotateY(360deg); }
			}
			@keyframes anim {
				from { transform: rotateY(180deg); }
				to { transform: rotateY(360deg); }
			}
		</style>

	</head>

	<body>
	<!--指引下载app-->
	<div class="guide" style="display: none;">
		<img id="close" src="../img/clear-input.png" alt="close">
		<img id="logo" src="../img/APP_logo.png" alt="logo">
		<span id="client">助利商城手机客户端</span>
		<span id="download">点击下载</span>
	</div>
	<!--红包-->
	<div class="red-gift" id="big" style="display: none">
		<div class="red-box">
			<img src="../img/hongbao2.jpg" alt="红包">
			<!--<p>收益 <span id="earning"></span> 元</p>-->
			<a id="get"><span>抢</span></a>
		</div>
	</div>
	<div class="small-red-gift" id="small" style="display: none">
		<img src="../img/red-gift.png" alt="小红包">
	</div>
	<!--漂浮消息-->
	<div class="float-box" style="display: none;">
		<!--<img src="../img/logo_h.jpg" alt="img">-->
		<!--<div class="float-text-box"></div>-->
	</div>
	<!--注册领红包-->
	<div class="register_packet" style="display: none;">
		<div class="packet-box">
			<div class="close_packet">
				<img src="../img/close.png" alt="关闭">
			</div>
			<img src="../img/register_packet.jpg" alt="新人红包" id="packet_money">

			<!--立即领取-->
			<a id="draw" style="display: none;"></a>
			<!--金额-->
			<a id="money" style="display: none;"></a>
			<!--确定-->
			<a id="certain" style="display: none;"></a>
		</div>
	</div>
	<!--大转盘-->
	<div class="big_lottery" style="display: none;">
		<div class="lottery-box">
			<div class="close_lottery">

			</div>
			<div class="go_pump"></div>
			<img src="../img/suspend_lottery.png" alt="抽奖活动" id="lottery">

			<!--跳转大转盘-->
			<a id="goLottery"></a>
		</div>
	</div>
	<!--大转盘小框-->
	<div class="small_lottery" style="display: none;">
		<img src="../img/small_lottery.png" alt="小转盘">
	</div>
		<!--
        	作者：lwy
        	时间：2017-02-06
        	描述：首页头部开始
        -->
		<header id="header" class="mui-bar mui-bar-nav">
			<a class="mui-icon mui-icon-bars mui-pull-left" id="present"><img src="../img/location.png" alt="位置"><b id="locationcity">总部</b><i class="more-area"></i></a>
			<a class="mui-icon mui-icon-info-filled mui-pull-right" href="news.html" id="news"><i class="xiaoxi"></i><b style="display: none;" id="ifRead"></b></a>
			<a class="mui-icon mui-icon-info-filled mui-pull-right" id="login" href="login.html"><i class="zhuce"></i></a>
			<h1 class="mui-title"><input class="index-input" type="text" value="搜索"/><a class="sousuo"></a></h1>
		</header>
		<div class="line line2" id="newSHopfixed" style="display: none;">
			<span class="line-left"></span>
			<span class="line-text">最新商家</span>
			<span class="line-right"></span>
		</div>
		<!--
        	作者：lwy
        	时间：2017-02-06
        	描述：首页头部结束，轮播图开始
       -->
        <div id="refreshContainer" class="mui-content mui-scroll-wrapper" style="margin-bottom: 50px">
		<div class="mui-content">
			<div class="swiper-container4">
				<div class="swiper-wrapper" id="banner">
					<!-- Slides -->
					<!--<div class="swiper-slide">-->
						<!--<a href="#">-->
							<!--<img src="../img/banner3.jpg">-->
						<!--</a>-->
					<!--</div>-->
					<!--<div class="swiper-slide">-->
						<!--<a href="#">-->
							<!--<img src="../img/banner1.jpg">-->
						<!--</a>-->
					<!--</div>-->
					<!--<div class="swiper-slide">-->
						<!--<a href="pattern.html">-->
							<!--<img src="../img/banner6.jpg">-->
						<!--</a>-->
					<!--</div>-->
					<!--<div class="swiper-slide">-->
						<!--<a href="#">-->
							<!--<img src="../img/banner4.jpg">-->
						<!--</a>-->
					<!--</div>-->
					<!--<div class="swiper-slide">-->
						<!--<a href="#">-->
							<!--<img src="../img/banner5.jpg">-->
						<!--</a>-->
					<!--</div>-->
					<!--<div class="swiper-slide">-->
						<!--<a href="#">-->
							<!--<img src="../img/banner1.jpg">-->
						<!--</a>-->
					<!--</div>-->
				</div>
				<!-- Add Pagination -->
				<div class="swiper-pagination4" id="pagination4"></div>
			</div>
        <!--
        	作者：lwy
        	时间：2017-02-06
        	描述：分类模块开始
        -->
			<div class="swiper-container2">
				<div class="swiper-wrapper">
					<div class="swiper-slide">
						<div class="sort-box mui-clearfix" id="sortBox1">
							<!--<a><div class="sort"><img src="../img/sort1.png"/>美食</div></a>-->
						</div>
					</div>
					<!--<div class="swiper-slide">-->
						<!--<div class="sort-box mui-clearfix" id="sortBox2">-->
							<!--&lt;!&ndash;<a id="10"><div class="sort"><img src="../img/sort1.png"/>机票/火车票</div></a>&ndash;&gt;-->
						<!--</div>-->
					<!--</div>-->
				</div>
				<div style="width: 100%;height: 14px;"></div>
				<!-- Add Pagination -->
				<!--<div class="swiper-pagination2"></div>-->
			</div>
			<!--新闻盒子开始-->
			<div class="scroll-box">
				<div class="notice-img"><img src="../img/notice.png" alt="通知"></div>
				<ul>
					<!--<li>1好消息！好消息！</li>-->
				</ul>
			</div>
        <!--
        	作者：lwy
        	时间：2017-02-06
        	描述：热门商家开始
        -->
        <div class="line">
        	<span class="line-left"></span>
        	<span class="line-text">热门商家</span>
        	<span class="line-right"></span>
			<div class="shop-more" id="more"><a href="shop_list.html">更多<span class="mui-icon mui-icon-arrowright"></span></a></div>
        </div>
        <!--
        	作者：837081299@qq.com
        	时间：2017-02-06
        	描述：超实惠标题结束
        -->
        <div class="shihui_box">
			<!--轮播2个半形式-->
			<div class="swiper-container">
				<div class="swiper-wrapper" id="hotShop">
					<div class="swiper-slide">
						<div class="hot-box" style="margin-right: 10px;">
							<img src="../img/loading.png"/>
						</div>
						<div class="hot-box" style="margin-right: 10px;">
							<img src="../img/loading.png"/>
						</div>
						<div class="hot-box" style="margin-right: 10px;">
							<img src="../img/loading.png"/>
						</div>
					</div>
				</div>
			</div>
		</div>
        <!--
        	作者：lwy
        	时间：2017-02-06
        	描述：最新商家开始
        -->
        <div class="line line2" id="newShop">
        	<span class="line-left"></span>
        	<span class="line-text">最新商家</span>
        	<span class="line-right"></span>
        </div>
        <!--
        	作者：837081299@qq.com
        	时间：2017-02-06
        	描述：最新商家标题结束
        -->
		<div class="newShop">
			<!--<div class="newShop-item mui-clearfix">-->
				<!--<div class="newshop-img"><img src="../img/loading.png" alt="加载中" class="newShop-logo"></div>-->
				<!--<div class="newShop-box">-->
					<!--<p class="newShop-title">叮当生鲜-东风路政七街店</p>-->
					<!--<p class="newShop-star"><img src="../img/star.png" alt=""></p>-->
					<!--<p class="newShop-sign">优质好店</p>-->
					<!--<p class="newShop-line"></p>-->
					<!--<p class="newShop-user"><img src="../img/newShop-user.png" alt="店主">店主</p>-->
					<!--<p class="newShop-phone"><img src="../img/newShop-phone.png" alt="电话">0387-89653214</p>-->
					<!--<p class="newShop-location"><img src="../img/newShop-location.png" alt="地址">郑州市二七区东风路政七街</p>-->
				<!--</div>-->
				<!--<div class="newShop-right-sign"><img src="../img/newShop-sign.png" alt="新店"></div>-->
			<!--</div>-->
		</div>
		</div>
		</div>
        <!--
        	作者：837081299@qq.com
        	时间：2017-02-07
        	描述：底部导航开始
        -->
        <nav class="mui-bar mui-bar-tab">
			<a class="mui-tab-item" id="index" href="index.html">
				<span class="mui-icon"><img src="../img/index-icon-act.png"/></span>
				<span class="mui-tab-label">首页</span>
			</a>
			<a class="mui-tab-item" id="nearby" href="nearby_shop.html">
				<span class="mui-icon"><img src="../img/nearby-icon.png"/></span>
				<span class="mui-tab-label">入驻</span>
			</a>
			<a class="mui-tab-item" id="shop" href="shop_list.html">
				<span class="mui-icon"><img src="../img/cart_icon_h.png"/></span>
				<span class="mui-tab-label">购物车</span>
			</a>
			<a class="mui-tab-item" id="me" href="personal_v2.html">
				<span class="mui-icon"><img src="../img/personal-icon.png"/></span>
				<span class="mui-tab-label">我的</span>
			</a>
		</nav>
		<div class="go-top" id="goTop" style="display: none;"><img src="../img/go-top.png" alt="回到顶部"></div>
		<script src="../js/mui.min.js"></script>
		<script src="../js/jquery-1.10.1.min.js"></script>
		<script src="../js/swiper-3.4.2.jquery.min.js"></script>
	<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
		<script>  document.write("<s"+"cript type='text/javascript' src='../js/commons.js?"+Math.random()+"'></scr"+"ipt>"); </script>
		<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=WfpHtWKGNVuic7WuI4VpiFueP4KNi1gv"></script>
		<script>
			document.write("<s"+"cript type='text/javascript' src='../js/index.js?"+Math.random()+"'></scr"+"ipt>");
		</script>
		<script>

			//分类滑动
			var swiper = new Swiper('.swiper-container2', {
				loop:false,
//				pagination: '.swiper-pagination2',
//				paginationClickable: true,
				spaceBetween: 0,
				observer: true,//修改swiper自己或子元素时，自动初始化swiper
				observeParents: true//修改swiper的父元素时，自动初始化swiper
			});
		</script>
	</body>

</html>